<template>
  <div class="my-tag" @dblclick="showInput">
    <input
      class="input"
      type="text"
      placeholder="输入标签"
      v-if="eidt"
      @blur="closeInput"
      @keyup.enter="closeInput"
      v-model="tags"
      v-focus
    />
    <div class="text" v-else>{{ value ? value : '无' }}</div>
  </div>
</template>

<script>
export default {
  name: 'MySon',
  props: {
    value: {
      type: String,
      required: true,
    },
  },
  data() {
    return {
      eidt: false,
      tags: '',
    };
  },
  methods: {
    //双击显示
    showInput() {
      this.eidt = true;
      this.tags = this.value;
    },
    //input失焦
    closeInput() {
      this.eidt = false;
      //his.value = this.tags
      this.$emit('input',this.tags)
    },
  },
};
</script>

<style scoped lang="less"></style>
